<template>
    <list-page :data="listPageConfig">
        <template v-slot:searchForm>
            <el-form-item label="公告号">
                <el-input v-model="searchForm.id" clearable maxlength="50"/>
            </el-form-item>
            <el-form-item label="标 题">
                <el-input v-model="searchForm.name" clearable maxlength="50"/>
            </el-form-item>
            <el-form-item label="创建人">
                <el-input v-model="searchForm.cname" clearable maxlength="50"/>
            </el-form-item>
            <el-form-item label="创建时间">
                <el-date-picker
                    v-model="temp.ctime"
                    format="yyyy-MM-dd"
                    range-separator="-"
                    type="daterange"
                    value-format="timestamp"/>
            </el-form-item>
            <el-form-item label="类 型">
                <el-select v-model="temp.pid" clearable multiple>
                    <el-option :value="0" label="拟定"/>
                    <el-option :value="1" label="待发布"/>
                    <el-option :value="2" label="已发布"/>
                </el-select>
            </el-form-item>
            <el-form-item label="状 态">
                <el-select v-model="temp.status" clearable multiple>
                    <el-option :value="0" label="拟定"/>
                    <el-option :value="1" label="待发布"/>
                    <el-option :value="2" label="已发布"/>
                </el-select>
            </el-form-item>
        </template>

        <template v-slot:tableColumn>    
            <el-table-column align="center" type="expand">
                <template v-slot="{row}">
                    <liner-progress :show="row._loading" />
                    <el-card shadow="hover">
                        <div style="display: flex; justify-content: center; align-items: center;background-color: palegoldenrod;">
                            <h2 slot="header" style="margin: 0 auto; ">公告内容查看</h2>
                        </div>          
                        <div  v-html="row.content"></div>
                    </el-card>
                </template>
            </el-table-column>
            <el-table-column align="center" label="#" type="index" width="80"/>
            <el-table-column align="center" label="公告号" width="160">
                <router-link
                    slot-scope="{row}"
                    :to="`/sell/order/detail/see/${row.id}`"
                    @click.native.stop
                >
                    {{ row.id }}
                </router-link>
            </el-table-column>
            <el-table-column align="center" label="标 题" prop="name" show-overflow-tooltip/>
            <el-table-column align="center" label="创建人" prop="cname" show-overflow-tooltip/>
            <el-table-column align="center" label="创建时间" width="150">
                <template v-slot="{row}">{{ row.ctime | timestamp2Date }}</template>
            </el-table-column>
            <el-table-column align="center" label="发布人" prop="vname" show-overflow-tooltip/>
            <el-table-column align="center" label="发布时间" width="150">
                <template v-slot="{row}">{{ row.vtime | timestamp2Date }}</template>
            </el-table-column>
            <el-table-column align="center" label="状 态" width="120">
                <template v-slot="{row}">
                    <span :class="{primary:row.status===1,success:row.status===2}" class="dot"/>
                    {{ getStatus(row.status) }}
                </template>
            </el-table-column>
            <el-table-column align="center" label="公告类型" width="120">
                <template v-slot="{row}">
                    <span :class="{primary:row.pid===1,success:row.pid===2}" class="dot"/>
                    {{ row.pname }}
                </template>
            </el-table-column>
            <el-table-column align="center" label="指示发布时间" width="150">
                <template v-slot="{row}">{{ row.ftime | timestamp2Date }}</template>
            </el-table-column>
        </template>
    </list-page>
</template>

<script>
import docTableMixin from '@/mixin/docTableMixin'
import {add, update, del, pass,  getSubById, search, exportExcel} from "@/api/doc/notice/notice"

export default {
    name: "sellOrder",

    mixins: [docTableMixin],

    data() {
        this.api = {add, update, del, pass, getSubById, search, exportExcel}
        return {
            searchForm: {
                customerName: null
            },
            temp: {
                finish: [],
                ftime: []
            }
        }
    },

    methods: {
        mergeSearchForm() {
            return {
                ...this.searchForm,
                status: this.temp.status.join(','),
                finish: this.temp.finish.join(','),
                ctimeStart: this.temp.ctime ? this.temp.ctime[0] : null,
                ctimeEnd: this.temp.ctime ? this.temp.ctime[1] + 86400000 : null,
                vtimeStart: this.temp.vtime ? this.temp.vtime[0] : null,
                vtimeEnd: this.temp.vtime ? this.temp.vtime[1] + 86400000 : null,
                ftimeStart: this.temp.ftime ? this.temp.ftime[0] : null,
                ftimeEnd: this.temp.ftime ? this.temp.ftime[1] + 86400000 : null,
            }
        }
    }
}

</script>
  
